//家谱菜单组
.jp-navbar{
  padding: 0 10px;
  position: inherit;
  .weui-bar__item_on{
    background: none;
    color: $theme_color;
    position: relative;
    &:before{
      content: '';
      width: 100%;
      position: absolute;
      bottom: 0;
      left: 0;
      height: 2px;
      background: $theme_color;
    }
  }
  .weui-navbar__item{
    padding: 10px 0;
    &:after{
      content: '';
      border-right: none;
    }
  }
  &:after{
    border-bottom: none;
  }
}
//搜索组
.jp-search-bar{
  background: $bgcolor;
  line-height: 1.8;
  .weui-search-bar__box{
    .weui-search-bar__input{
      padding: 6px 0;
    }
  }
  &:before{
    border-top: none;
  }
  &:after{
    border-bottom: none;
  }
}
.jp-btn-group{
  .weui-btn_mini{
    padding: 0 1em;
    line-height: 1.8;
    border-radius: 3px;
  }
}
//家谱模板列表
.model_list{
  padding: 5px;
  .jp-flex{
    .jp-inline-3{
      margin: 5px;
      padding: 5px;
      position: relative;
      width: calc(33.333% - 10px);
      float: left;
      .item_text{
        @extend .text_oneline;

        position: absolute;
        line-height: 2;
        text-align: center;
        background: rgba(0, 0, 0, .5);
        color: #ffffff;
        left: 5px;
        bottom: 5px;
        width: calc(100% - 10px);
        font-size: 12px;
      }
      .item-label{
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        right: 0;
        border: 1px solid $border_color;
      }
      .item-radio{
        position: absolute;
        left: -9999999px;
        &:checked + .item-label{
          border-color: $theme_color;
        }
      }
    }
    .temp{
      .item-radio{
        &:checked + .item-label{
          &:before{
            width: 18px;
            height: 18px;
            background: $theme_color;
            position: absolute;
            right: 0;
            z-index: 9;
            bottom: 0;
            display: inline-block;
            content: '';
          }
          &:after{
            content: 'V';
            position: absolute;
            bottom: 0;
            right: 0;
            color: #ffffff;
            z-index: 10;
            width: 18px;
            text-align: center;
          }
        }
      }
    }
  }
}
//创建家谱输入表单
.jp-input{
  .jp-input-cell{
    border: 1px solid $border_color;
    border-radius: 4px;
  }
  .weui-cell{
    &:before{
      border-top: none;
    }
  }
  .weui-cells{
    font-size: 14px;

    &:before{
      border-top: none;
    }
    &:after{
      border-bottom: none;
    }

    .weui-check__label{
      padding: 0;
    }
  }

  .weui-cell_select{
    .weui-select{
      border: 1px solid $border_color;
      border-radius: 4px;
      height: 42px;
      line-height: 42px;
    }
    .weui-cell__bd{
      &:after{
        content: '';
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 6px 5px 0 5px;
        border-color: #696969 transparent transparent transparent;
        transform: none;
      }
    }
  }
}
//表单同意
.jp-agree{
  .weui-agree__checkbox{
    width: 20px;
    height: 15px;
  }
  .weui-agree{
    padding: .5em 5px;
    font-size: 14px;
  }
}
//编辑家庭谱
.jp-edit-bg{
  background: #282828;
  padding: 20px 0;
}
.jp-edit{
  background: url("../../app-JPshow/images/jpbg.png") repeat;
  width: 100%;
  height: calc(100% - 40px);
  padding: 20px 0;
  .jp-edit-t{
    width: auto;
    display: table;
    margin: 0 auto;
  }
  .jp-edit-title{
    font-size: 22px;
    color: $edit-name-font-color;
  }
  .jp-edit-subtitle{
    font-size: 22px;
    color: $edit-subtitle-font-color;
    padding-top: 15px;
  }
  .jp-edit-english{
    font-size: 18px;
    color: $edit-english-font-color;
    padding-top: 10px;
  }
  .jp-edit-border{
    padding: 0.2em 1em;
    border: 1px dashed $edit-border-color;
  }
  .jp-edit-border-active{
    border-color: $edit-border-color-active;
  }
  .jp-edit-cover{
    padding: 15px 0;
    text-align: center;
    img{
      width: 60%;
    }
  }
}
.jp-edit-option{
  background: #ffffff;
  font-size: 16px;
  position: fixed;
  width: 100%;
  bottom: 0;

  .weui-grids{
    &:before{
      border-top: none;
    }
    &:after{
      border-left: none;
    }
  }
  .weui-grid{
    padding: 10px;

    &:before{
      border-right: none;
    }
    &:after{
      border-bottom: none;
    }
  }
}
//下弹菜单
.jp-actionsheet{
  .weui-actionsheet__cell{
    font-size: 15px;
  }
  .weui-cells{
    margin-top: 0;
    font-size: 14px;
  }
  .jp-catalog-name{
    width: 5em;
    display: inline-block;
  }
  .jp-catalog-count{
    @extend .text_lg;

    width: auto;
    display: inline-block;
  }
  .weui-actionsheet__cell{
    .arrow-down{
      position: relative;

      &:before{
        position: absolute;
        top: 6px;
        left: -15px;
        content: '';
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 6px 5px 0 5px;
        border-color: #656565 transparent transparent transparent;
      }
    }
  }
}
//banner图
.jp-banner{
  img{
    max-width: 100%;
    height: auto;
  }
}
.family-book-click-item:active{
  background: #e6e6e6;
}

//图标
.iconfont{
  vertical-align: middle;
}
.icon-zfb{
  color: #00a7f0;
}
.icon-wx{
  color: #03c902;
}